<!DOCTYPE html>
{% block title %}<h4>服务搜索系统</h4>{% endblock %}
{% block head %}
<meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu" crossorigin="anonymous">

<!-- 可选的 Bootstrap 主题文件（一般不用引入） -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap-theme.min.css" integrity="sha384-6pzBo3FDv/PJ8r2KRkGHifhEocL+1X2rVCTTkUfGk7/0pbek5mMa1upzvWbrUbOZ" crossorigin="anonymous">

<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js" integrity="sha384-aJ21OjlMXNL5UyIl/XNwTMqvzeRMZH2w8c5cRVpzpU8Y5bApTppSuUkhZXN0VxHd" crossorigin="anonymous"></script>
{% endblock %}
{% block script%}
<script src="{{url_for('static',filename ='json2.js')}}" type="text/javascript"></script>
{% endblock %}
{% block body %}
<form action="/" class="form-inline col-sm-offset-5 col-md-offset-5" name="index" method="POST">
    <input type="text" name="query" class="form-control" placeholder="输入需求" required="required"/>
    <input type="submit" class="btn btn-primary" value="查找相关服务">
</form>
<div style="width: 1000px" class="col-sm-offset-3">
  <table style="table-layout:fixed" class="table ">
    <caption>搜索结果</caption>
    <thead>
      <tr class="row">
        <th width="10%">name</th>
        <th width="50%">description</th>
        <th width="10%">status</th>
      </tr>
    </thead>
    <tbody>
    {% for data in result %}
      <tr class="row">
        <td style="overflow:hidden; white-space:nowrap"><a href={{"/api_page/"+data["api_id"]}}>{{data["name"]}}</a></td>
        <td style="overflow:hidden;white-space:nowrap;text-overflow:ellipsis;">{{data["description"]}}</td>
        {% if data["status"] %}
        <td>可用</td>
        {% else %}
        <td>不可用</td>
        {% endif %}

      </tr>
    {% endfor %}
    </tbody>
  </table>
</div>
{% endblock %}